import React, { Suspense } from "react";
import { BrowserRouter, useRoutes } from "react-router-dom";
import * as modulesRoutes from "./modules";
import { Spin } from "antd";
const Layout = React.lazy(() => import("COMPONENT/layout"));
const NotFund = React.lazy(() => import("VIEW/notFound"));
let _modulesRoutes = [];
for (const i in modulesRoutes) {
  _modulesRoutes.push(modulesRoutes[i]);
}

// 路由配置对象
let rootRoute = [
  {
    path: "/",
    element: <Layout />,
    children: [..._modulesRoutes.reduce((s, v) => s.concat(v), [])],
  },

  {
    path: "*",
    element: <NotFund />,
  },
];

const handleRouteList = route => route;

function createRouteSheet() {
  const RouterSheet = () => useRoutes(handleRouteList(rootRoute));
  return (
    <BrowserRouter>
      <Suspense fallback={<Spin size="large" style={{ marginTop: "125px" }} />}>
        <RouterSheet />
      </Suspense>
    </BrowserRouter>
  );
}
export default rootRoute;
export { createRouteSheet };
